<?xml version="1.0" encoding="UTF-8"?>
<nifty-styles>
  <!-- +++++++++++++++++++++++++++++++++++++ -->
  <!-- style for the button background panel -->
  <!-- +++++++++++++++++++++++++++++++++++++ -->
  <style id="nifty-button#panel">
    <attributes backgroundImage="button/button.png" imageMode="sprite-resize:100,23,0,2,96,2,2,2,96,2,19,2,96,2,2" paddingLeft="7px" paddingRight="7px" width="100px" height="23px" childLayout="center" visibleToMouse="true" />
    <effect>
      <onHover name="border" color="#822f" post="true" />
      <onFocus name="imageOverlay" filename="button/button.png" imageMode="sprite-resize:100,23,1,2,96,2,2,2,96,2,19,2,96,2,2" post="true" />
      <onEnabled name="renderQuad" startColor="#2228" endColor="#2220" post="true" length="150" />
      <onDisabled name="renderQuad" startColor="#2220" endColor="#2228" post="true" length="150" />
    </effect>
  </style>

  <!-- +++++++++++++++++++++++++++++++++++++ -->
  <!-- style for the button text -->
  <!-- +++++++++++++++++++++++++++++++++++++ -->
  <style id="nifty-button#text" base="button-font">
    <attributes align="center" valign="center" textHAlign="center" textVAlign="center" visibleToMouse="false"/>
    <effect>
      <onEnabled name="textColorAnimated" startColor="#8886" endColor="#eeef" post="false" length="150" />
      <onDisabled name="textColorAnimated" startColor="#eeef" endColor="#8886" post="false" length="150" />
    </effect>
  </style>
</nifty-styles>
